<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge,chrome=1">
    <meta name="author" content="HYL">
    <title>小米官网</title>
    <link rel="stylesheet" type="" href="小米官网.css">
    <link rel="stylesheet" href="./font-awesome/css/font-awesome.min.css">
</head>
<body>
      <!--  导航栏部分-------------------- -->
    <nav class="nav">
      <div class="container">   
        <ul class="nav_list">
            <a href="#"><li>小米商城</li><span class="specila">|</span></a>
            <a href="#"><li>MIUI</li><span class="specila">|</span></a>
            <a href="#"><li>米聊</li><span class="specila">|</span></a>
            <a href="#"><li>游戏</li><span class="specila">|</span></a>
            <a href="#"><li>多读阅读</li><span class="specila">|</span></a>
            <a href="#"><li>云服务</li><span class="specila">|</span></a>
            <a href="#"><li>金融</li><span class="specila">|</span></a>
            <a href="#"><li>小米商城手机版</li><span class="specila">|</span></a>
            <a href="#"><li>问题反馈</li><span class="specila">|</span></a>
            <a href="#"><li>SelectReginon</li></a>                     
        </ul>
        <div class="shoppingcar">
            <a href="#"><div></div>购物车(0)</a>
        </div>
        <ul class="register">
            <a href="#"><li>登录</li><span class="specila">|</span></a>
            <a href="#"><li>注册</li><span class="specila">|</span></a>
            <a href="#"><li>消息通知</li></a>
        </ul>
        <div class="no-shop">购物车中还没有商品，赶紧选购吧！</div>
       </div>
    </nav>
    <!-- 导航栏下面的部分 --> 
    <header>
        <ul class="list container">
            <li class="logo"></li>
            <li class="list-style">
                <section class="xiaomishouji">小米手机</section>
                <section class="hongmi">红米</section>
                <section class="pingban">平板·笔记本</section>
                <section class="dianshi">电视</section>
                <section class="hezi">盒子·影音</section>
                <section class="luyouqi">路由器</section>
                <section class="zhineng">智能硬件</section>
                <section>服务</section>
                <section>社区</section>
            </li>
            <li class="input-all">
                <input type="text" name="" value="">
                <div class="TV">
                    <span class="TV1">电视4A55</span>
                    <span class="TV2">小米Note2特惠</span>
                </div>
                <div class="search"><i class="fa fa-search fa-2x" aria-hidden="true"></i> </div>
            </li>
        </ul>
        <ul class="hide">
            <ul class="xiaomiphone">
            <li>
                    <span>##</span>
                    <img src="phone.png" alt="">
                    <span>小米6</span>
                    <span>2499元起</span>
                </li>
                 <li>
                    <span>现货</span>
                    <img src="phone.png" alt="">
                    <span>小米6</span>
                    <span>2499元起</span>
                </li>
                 <li>
                    <span>新品</span>
                    <img src="phone.png" alt="">
                    <span>小米6</span>
                    <span>2499元起</span>
                </li>
                 <li>
                    <span>立减500</span>
                    <img src="phone.png" alt="">
                    <span>小米6</span>
                    <span>2499元起</span>
                </li>
                 <li>
                    <span>立减500</span>
                    <img src="phone.png" alt="">
                    <span>小米6</span>
                    <span>2499元起</span>
                </li>
                 <li>
                    <span class="jian">立减200</span>
                    <img src="phone.png" alt="">
                    <span>小米6</span>
                    <span class="money">2499元起</span>
                </li>
            </ul>
            <ul class="redmi">
                <li>
                    <span>新品</span>
                    <img src="redmi.png" alt="">
                    <span>红米Note5A版本</span>
                    <span>600元起</span>
                </li>
                <li>
                    <span>新品</span>
                    <img src="redmi.png" alt="">
                    <span>红米Note5A版本</span>
                    <span>600元起</span>
                </li>
                <li>
                    <span>新品</span>
                    <img src="redmi.png" alt="">
                    <span>红米Note5A版本</span>
                    <span>600元起</span>
                </li>
                <li>
                    <span>新品</span>
                    <img src="redmi.png" alt="">
                    <span>红米Note5A版本</span>
                    <span>600元起</span>
                </li>
                <li>
                    <span>新品</span>
                    <img src="redmi.png" alt="">
                    <span>红米Note5A版本</span>
                    <span>600元起</span>
                </li>
            </ul>
            <ul class="pingban1">
                <li>
                    <img src="pingban.jpg" alt="">
                    <span>小米笔记本Air12.5</span>
                    <span>4999元起</span>
                </li>
                <li>
                    <img src="pingban.jpg" alt="">
                    <span>小米笔记本Air12.5</span>
                    <span>4999元起</span>
                </li>
                <li>
                    <img src="pingban.jpg" alt="">
                    <span>小米笔记本Air12.5</span>
                    <span>4999元起</span>
                </li>
            </ul>
            <ul class="dianshi1">
                <li>
                    <span>超薄旗舰</span>
                    <img src="dianshi.png" alt="">
                    <span>小米电视 4.49寸</span>
                    <span>3499元</span>
                </li>
                <li>
                    <span>超薄旗舰</span>
                    <img src="dianshi.png" alt="">
                    <span>小米电视 4.49寸</span>
                    <span>3499元</span>
                </li>
                <li>
                    <span>超薄旗舰</span>
                    <img src="dianshi.png" alt="">
                    <span>小米电视 4.49寸</span>
                    <span>3499元</span>
                </li>
                <li>
                    <span>超薄旗舰</span>
                    <img src="dianshi.png" alt="">
                    <span>小米电视 4.49寸</span>
                    <span>3499元</span>
                </li>
                <li>
                    <span>超薄旗舰</span>
                    <img src="dianshi.png" alt="">
                    <span>小米电视 4.49寸</span>
                    <span>3499元</span>
                </li>
                <li>
                    <span>超薄旗舰</span>
                    <img src="dianshi.png" alt="">
                    <span>小米电视 4.49寸</span>
                    <span>3499元</span>
                </li>
            </ul>
            <ul class="hezi1">
                <li>
                    <img src="hezi.jpg" alt="">
                    <span>小米盒子3c</span>
                    <span>229元</span>
                </li>
                <li>
                     <img src="hezi.jpg" alt="">
                    <span>小米盒子3c</span>
                    <span>229元</span>
                </li>
                <li>
                     <img src="hezi.jpg" alt="">
                    <span>小米盒子3c</span>
                    <span>229元</span>
                </li>
                <li>
                    <img src="hezi.jpg" alt="">
                    <span>小米盒子3c</span>
                    <span>229元</span>
                </li>
            </ul>
            <ul class="luyouqi1">
                <li>
                    <span>双千兆</span>
                    <img src="luyouqi.png" alt="">
                    <span>小米路由器盒子3增强版</span>
                    <span>99元</span>
                </li>
                <li>
                    <span>双千兆</span>
                    <img src="luyouqi.png" alt="">
                    <span>小米路由器盒子3增强版</span>
                    <span>99元</span>
                </li>
                <li>
                    <span>双千兆</span>
                    <img src="luyouqi.png" alt="">
                    <span>小米路由器盒子3增强版</span>
                    <span>99元</span>
                </li>
                <li>
                    <span>双千兆</span>
                    <img src="luyouqi.png" alt="">
                    <span>小米路由器盒子3增强版</span>
                    <span>99元</span>
                </li>
            </ul>

        </ul>

    </header>





<script src="Jqurey.js"></script>
</body>
</html>
<script src="小米官网.javaScript"></script>